<!DOCTYPE HTML>
<html>
<head>
    <title>Test My WebSocket</title>
	<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
    <script type="text/javascript" src="js/base-v1.js" charset="utf-8"></script>
    <script type="text/javascript" src="js/jquery-1.2.6.min.js" charset="utf-8"></script>
    <script type="text/javascript" src="js/cookie.js" charset="utf-8"></script>
    <script type="text/javascript" src="js/common.js" charset="utf-8"></script>
    <script type="text/javascript" src="js/jquery.cookie.js" charset="utf-8"></script>
    <script type="text/javascript" src="s/base-2011.js" charset="utf-8"></script>
    <script type="text/javascript" src="js/jquery.min.js" charset="utf-8"></script>
    <script type="text/javascript" src="js/jquery-extend.js"></script>
    <script type="text/javascript" src="js/lib-v1.js" charset="utf-8"></script>
    <link href="css/prodList.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="js/logout.js"></script>
    <meta charset="UTF-8">
</head>


<body>
<div id="welcome">欢迎用户：</div></br>
发送消息：
<input hidden id="userName" name="userName" value=""></div>
<input  id="text" type="text" />
接收人：<input  id="receiveId" name="receiveId" type="text" value="" />
<button onclick="send()">发送消息</button>
<button onclick="closeWebSocket()">关闭</button>
<div id="message"></div>
</body>
<script type="text/javascript">
	
		function getName(){
			var userId="";
            var _ticket = $.cookie("EM_TICKET");
            if(!_ticket){
                window.location.href="login.html";
                return ;
            }
			$.ajax({
                url : "http://www.easyhouse.com/user/query/" + _ticket,
                dataType : "json",
                type : "GET",
				async:false,
                success : function(data){

                    if(data.status == 200){
                        var _data = JSON.parse(data.data);//jackson
                        if(_data==null){
                            alert("啥也别说了，你的用户超时了,赶紧查查redis还有数据没有");
                            window.location.href="./login.html";
                            return;}
                        //var html =_data.userName+"，欢迎来到好房！<a href=\"javascript:void(0)\" class=\"link-logout\" onclick='logout()'>[退出]</a>  \|<a href=\"http://www.easyhouse.com/manage.html\" class=\"link-logout\">[后台]</a>";
                        userId=_data.userId;
						var userName = _data.userName;
						var html="欢迎用户："+userName;
                        var userNameInput = document.getElementById("userName");
						userNameInput.setAttribute("value",userName);
						$("#welcome").append(userName);
                        //query(userId);
						//var element = document.getElementById("userName");
						//element.setAttribute("value",_data.userName);
						return userName;
                    }else{
						return "";
                        alert("咋了兄弟，购物车没东西自己心里没数吗，赶紧购物去");
                    }
					
                },
                error : function(){
					return "";
                    alert('index error.');
                }
            });
			//alert(userName);
      }
</script>
<script type="text/javascript">
	var websocket = null;
	var str = getName();
	var userName = document.getElementById('userName').value;
    //判断当前浏览器是否支持WebSocket
	if('WebSocket' in window){
	//连接WebSocket节点
	//alert("好啊1");
	//alert(userName);
	websocket = new WebSocket("ws://localhost:10010/connectWebSocket/"+userName);
	}
	else{
	alert('Not support websocket')
	}
    //连接发生错误的回调方法
    websocket.onerror = function(){
        setMessageInnerHTML("error");
    };
    //连接成功建立的回调方法
    websocket.onopen = function(event){
        setMessageInnerHTML("open");
    }
    //接收到消息的回调方法
    websocket.onmessage = function(event){
        setMessageInnerHTML(event.data);
    }
    //连接关闭的回调方法
    websocket.onclose = function(){
        setMessageInnerHTML("close");
    }
    //监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。
    window.onbeforeunload = function(){
        websocket.close();
    }
    //将消息显示在网页上
    function setMessageInnerHTML(innerHTML){
		var _data = JSON.parse(innerHTML);//jackson
		var myDate = new Date();
		var mytime=myDate.toLocaleTimeString();
		
		//alert(mytime);
		console.log(_data);
		if(_data.messageType==4){
			document.getElementById('message').innerHTML += _data.fromuserId+" "+mytime+":"+_data.textMessage+ '<br/>';
		}
        
    }
    //关闭连接
    function closeWebSocket(){
        websocket.close();
    }
    //发送消息
    function send(){
        var message = document.getElementById('text').value;
		var userName = document.getElementById('userName').value;
		var receiveId = document.getElementById('receiveId').value;
		//console.log(userName);
		var info1 = "{\"message\":\""+message+"\",\"userId\":\""+userName+"\",\"to\":\""+userName+"\"}"
		var info2 = "{\"message\":\""+message+"\",\"userId\":\""+userName+"\",\"to\":\""+receiveId+"\"}"
		//console.log(info);
        websocket.send(info1);
        websocket.send(info2);
    }
</script>
</html>